<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>模仿世纪佳缘</title>
    <link rel="stylesheet" href="index.css">
    <link rel="stylesheet" href="common.css">
</head>
<body class="">

<div class="header wrap1000 clear">
    <h1 class="logo">
        <a href="#" title="世纪佳缘的logo">
            <img src="https://images2.jyimg.com/msn/index_pic/jy_common_1578537618.jpeg" alt="世纪佳缘的logo"></a>
    </h1>
    <div class="login">
        <form action="#">
            <input type="text" name="username" id="username" placeholder="邮箱/ID/手机号">
            <input type="password" name="password" id="password" placeholder="密码">
            <input type="button" value="登录">
        </form>
    </div>
    <div class="other-login">
        <div class="f1">
            <span>其他登录</span>
            <ul>
                <li>qq</li>
                <li>微博</li>
                <li>百度</li>
                <li>微信</li>
            </ul>
        </div>
        <div class="f2"><span>海外用户登录</span></div>
        <div class="f3">
            <span>忘记密码</span>
        </div>
    </div>

</div>
<div class="clear"></div>
<div class="big-register">
    <div class="wrap1000 box">
        <form action="#" class="register-form">
            <table>
                <tr>
                    <td class="title" colspan="2">一分钟注册，享一辈子幸福</td>
                </tr>
                <tr>
                    <td class="text-start ">性别</td>
                    <td class="sex">
                        <input type="radio" value="male" id="male" checked name="sex">
                        <label for="male" class="sex-icon-male">男</label>
                        <span class="padding-right-20"></span>
                        <input type="radio" value="female" id="female" name="sex">
                        <label for="female" class="sex-icon-female">女</label>
                    </td>
                </tr>
                <tr>
                    <td class="text-start">生日</td>
                    <td class="input-group">
                        <input type="date" name="birthday" id="birthday">
                    </td>
                </tr>
                <tr>
                    <td class="text-start">所在地区</td>
                    <td>
                        <select name="address" id="address">
                            <!-- 请根据ip自动填充默认省份 附 city.json-->
                            <option value="">--Please choose an option--</option>
                            <option value="dog">Dog</option>
                            <option value="cat">Cat</option>
                            <option value="hamster">Hamster</option>
                            <option value="parrot">Parrot</option>
                            <option value="spider">Spider</option>
                            <option value="goldfish">Goldfish</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td class="text-start">婚姻状况</td>
                    <td class="marry">
                        <input type="radio" name="marry" id="un_marry">
                        <label for="un_marry">未婚</label>
                        <input type="radio" name="marry" id="bad_marry">
                        <label for="bad_marry">离婚</label>
                        <input type="radio" name="marry" id="die_marry">
                        <label for="die_marry">丧偶</label>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                            <span class="free-register" type="submit">
                                免费注册
                            </span>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align: center">
                            <span class="yet-vip">
                                我是会员，立即登录
                            </span>
                    </td>

                </tr>
            </table>
        </form>


    </div>
</div>

<div class="slogan-banner">
    <div class="inner wrap1000"></div>
</div>
<div class="vips">
    <div class="title wrap1000">
        <h2>2.2亿优质会员，就在眼前</h2>
    </div>
    <div class="show-vip wrap1000">
        <div class="cate-data">
            <a href="#">全部1</a>
            <a href="#">全部2</a>
            <a href="#">全部3</a>
            <a href="#">全部4</a>
            <a href="#">全部5</a>
            <a href="#">全部6</a>
            <a href="#">全部7</a>
            <a href="#">全部8</a>
            <a href="#">全部9</a>
        </div>
        <div class="vip-pics">
            <div class="pos1 size1"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈1"></div>
            <div class="pos2 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈2"></div>
            <div class="pos3 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈3"></div>
            <div class="pos4 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈4"></div>
            <div class="pos5 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈5"></div>
            <div class="pos6 size1"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈6"></div>
            <div class="pos7 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈7"></div>
            <div class="pos8 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈8"></div>
            <div class="pos9 size1"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈9"></div>
            <div class="pos10 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈10"></div>
            <div class="pos11 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈11"></div>
            <div class="pos12 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈12"></div>
            <div class="pos13 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈13"></div>
            <div class="pos14 size1"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈14"></div>
            <div class="pos15 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈15"></div>
            <div class="pos16 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈16"></div>
            <div class="pos17 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈17"></div>
            <div class="pos18 size2"><img src="little_vip.jpg" alt="美女哈哈" title="美女哈哈18"></div>
        </div>
    </div>
    <div class="filter-form wrap1000">
        <div class="inner">
            更多优质会员，请搜索
        </div>
        <form action="#" class="filter">
            <label for="friend-type">我要找</label>
            <select name="friend-type" id="friend-type">
                <option value="male">女朋友</option>
                <option value="female">男朋友</option>
                <option value="female">那种朋友</option>
            </select>
            <label for="min-age">最小年龄</label>
            <select name="min-age" id="min-age">
                <option value="24">24岁</option>
                <option value="24">24岁</option>
                <option value="24">24岁</option>
                <option value="24">24岁</option>
                <option value="24">24岁</option>
                <option value="24">24岁</option>
            </select>
            <label for="max-age">最大年龄</label>
            <select name="max-age" id="max-age">
                <option value="88">88岁</option>
                <option value="88">88岁</option>
                <option value="88">88岁</option>
                <option value="88">88岁</option>
                <option value="88">88岁</option>
                <option value="88">88岁</option>
            </select>
            <label for="city">所在城市</label>
            <select name="city" id="city">
                <option value="1505">二级联动</option>
                <option value="1505">city.json</option>
                <option value="1504">赤峰</option>
            </select>
            <input type="submit" class="filter-btn" value="搜索"/>
        </form>
    </div>
</div>

</div>

<div class="pair-success">
    <div class="title wrap1000">
        <div class="inner">
            就在你身边，他们相爱啦！
        </div>
    </div>
    <div class="loves wrap1000">
        <div class="item pos1">
            <a href="#"><img src="peis_160x160.jpg" alt="配对成功1">
                <div class="userinfo">
                    <em>用户1 male & 用户1*2 female</em>
                    <em>2022-05-20</em>
                </div>
            </a>
        </div>
        <div class="item pos2"><a href="#"><img src="peis_160x160.jpg" alt="配对成功2">
            <div class="userinfo"><em>用户2 male & 用户2*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos3"><a href="#"><img src="peis_160x160.jpg" alt="配对成功3">
            <div class="userinfo"><em>用户3 male & 用户3*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos4"><a href="#"><img src="peis_160x160.jpg" alt="配对成功4">
            <div class="userinfo"><em>用户4 male & 用户4*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos5"><a href="#"><img src="peis_160x160.jpg" alt="配对成功5">
            <div class="userinfo"><em>用户5 male & 用户5*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos6"><a href="#"><img src="peis_160x160.jpg" alt="配对成功6">
            <div class="userinfo"><em>用户6 male & 用户6*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos7"><a href="#"><img src="peis_160x160.jpg" alt="配对成功7">
            <div class="userinfo"><em>用户7 male & 用户7*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos8"><a href="#"><img src="peis_160x160.jpg" alt="配对成功8">
            <div class="userinfo"><em>用户8 male & 用户8*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos9"><a href="#"><img src="peis_160x160.jpg" alt="配对成功9">
            <div class="userinfo"><em>用户9 male & 用户9*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos10"><a href="#"><img src="peis_160x160.jpg" alt="配对成功10">
            <div class="userinfo"><em>用户10 male & 用户10*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos11"><a href="#"><img src="peis_160x160.jpg" alt="配对成功11">
            <div class="userinfo"><em>用户11 male & 用户11*2 female</em><em>2022-05-20</em></div>
        </a></div>
        <div class="item pos12"><a href="#"><img src="peis_160x160.jpg" alt="配对成功12">
            <div class="userinfo"><em>用户12 male & 用户12*2 female</em><em>2022-05-20</em></div>
        </a>
        </div>
    </div>
</div>
<div class="service-banner">
    <div class="wrap1000 inner">
        红娘一对一服务 精准定位你的爱情
    </div>
</div>
<div class="footer">尾部 友情链接 公司信息</div>
<script>
</script>
</body>
</html>
